<template>
  <div id="shoppingcar">
    <navbar class="narbar">
      <div class="go" slot="middle">
        <span>购物车 ({{ cartlength }}) </span>
      </div>
    </navbar>
    <shoppinglist></shoppinglist>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import navbar from "components/common/navbar/Navbar.vue";
import shoppinglist from "./shoppingcar_children/shoppingcarlist.vue";
export default {
  // 组件名称
  name: "shoppingcar", // 组件参数 接收来自父组件的数据
  props: {}, // 局部注册的组件
  components: { navbar, shoppinglist }, // 组件状态值
  data() {
    return {};
  },
  computed: {
    // cartlength() {
    //   return this.$store.state.productlist.length;
    // },
    ...mapGetters(["cartlength"]),
  },
};
</script>
<style scoped>
.go {
  font-size: 18px;
  color: #fff;
}
.narbar {
  background-color: palevioletred;
}
</style>